<!-- 卒中质控 -->


<style lang="less">
.chest-pain-quality {
  width: 100%;
  height: calc(100vh - 50px);
  padding: 10px;

  .el-tabs {
    height: 100%;
  }

  .el-tabs__content {
    height: calc(100% - 56px);
  }

  .el-tab-pane {
    height: 100%;
  }

  .box-chose {
    height: 80px;
    padding-left: 30px;
    padding-top: 20px;
  }

  .box-echart {
    height: ~'calc(100% - 80px)';
    overflow: auto;
    background: #f0f2f5;
    padding: 20px 20px 0 20px;

    .box-card {
      width: 32%;
      height: 506px;
      display: inline-block;
      margin: 0 10px;

      .el-card__body {
        height: ~'calc(100% - 55px)';
      }
    }
  }
}
</style>

<template>
  <div class="chest-pain-quality">
    <el-tabs v-model="activeName" type="card">
      <el-tab-pane label="数据概览" name="traumaDataView">
        <traumaDataView v-if="activeName == 'traumaDataView'" />
      </el-tab-pane>
      <el-tab-pane label="MPDS症状" name="trumaMpds">
        <trumaMdps v-if="activeName == 'trumaMpds'" />
      </el-tab-pane>
      <el-tab-pane label="基本数据统计" name="trumaBasic">
        <trumaBasic v-if="activeName == 'trumaBasic'" />
      </el-tab-pane>
      <el-tab-pane label="创伤质控指标" name="trumaQualityChart">
        <trumaQualityChart v-if="activeName == 'trumaQualityChart'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import traumaDataView from './components/traumaDataView'
import trumaMdps from './components/trumaMpds'
import trumaBasic from './components/trumaBasic'
import trumaQualityChart from './components/trumaQualityChart'
export default {
  name: 'trumaPainQuality',
  components: {
    trumaQualityChart,
    traumaDataView,
    trumaMdps,
    trumaBasic
  },
  data() {
    return {
      activeName: 'traumaDataView'
    }
  }

}
</script>
